<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" media="screen" href="/index.css" />
    <script src="http://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script>
        function fade(txt){
            $('.message').text(txt)
            $('.message').animate({
                top:0
            })
            setTimeout(function(){
                $('.message').animate({
                    top:'-100%'
                })
            },1500)
        }

        $(function(){
            $('.signout').click(function(){
                $.ajax({
                    url:"/signout",
                    type:"GET",
                    cache:false,
                    dataType:'json',
                    success:function(msg){
                        if(msg){
                            fade('登出成功(*^_^*)')
                            setTimeout(function(){
                                location.href = "/posts"
                            },1000)
                        }
                    },
                    error:function(){
                        alert('哎呀，出现异常了╮(╯▽╰)╭')
                    }
                })
            })
        })
    </script>
</head>
<body>
    <header>
        <div class="user_name">
        <% if(session.user){ %>
            hello,<%= session.user %>
        <%} %>
        <% if(!session.user){%>
             欢迎注册登录(*^_^*)
        <%}
        %>
        %>
        </div>
        <div class="message">
            登录成功
        </div>
        <div class="user_right">
        <% if(session.user){%>
            <div class="has_user">
                <a href="" target="_blank">GitHub</a>
                <% if(type=='all'){%>
                    <a class="active" href="/posts">全部文章</a>
                <%}else{%>
                    <a href="/posts">全部文章</a>
                <%}
                %>

                <% if(type=='my'){%>
                    <a class="active" href="">我的文章</a>
                <%}else{%>
                     <a href="">我的文章</a>
                <%}
                %>
                <% if(type=='create'){%>
                    <a class="active" href="/create">发表文章</a>
                <%}else{%>
                     <a href="/create">发表文章</a>
                <%}
                %>
            
                <span class="signout">登出</span>
            </div>
        <%}
        %>
        <% if(!session.user){%>
             <div class="none_user has_user">
                <a target="__blank" href="">GitHub</a>
                <% if(type=='all'){%>
                    <a class="active" href="/posts">全部文章</a>
                <%}else{%>
                    <a href="/posts">全部文章</a>
                <%}
                %>
                 <% if(type=='signup'){%>
                   <a class="active" href="/signup">注册</a>
                <%}else{%>
                    <a href="/signup">注册</a>
                <%}
                %>
                 <% if(type=='signin'){%>
                    <a class="active" href="/signin">登录</a>
                <%}else{%>
                    <a href="/signin">登录</a>
                <%}
                %>  
            </div>
        <%}
        %>
            
        </div>
    </header>
</body>
</html>